@charset "utf-8"; /* CSS Document */
.banner { padding: 20px 0 10px; } 
.banner .banner-box { overflow: hidden; border-radius: 10px; height: 360px; } 
.banner .banner-box img { width: 100%; height: 100%; display: block; object-fit: cover; } 
.class-list { /*height: 64px; */ padding-top: 30px; box-sizing: border-box; } 
.class-list .class-item { line-height: 32px; height: 32px; float: left; padding: 0 21px; font-size: 16px; margin-right: 21px; cursor: pointer; } 
.class-list .class-more { font-size: 20px; height: 32px; float: left; } 
.class-list .curr { background: #3C81F9; color: #fff; border-radius: 32px; } 
.floor { padding: 50px 0 0; } 
.floor .title { line-height: 24px; } 
.floor .title h3 { font-size: 24px; font-weight: normal; } 
.floor .title .more { float: right; font-size: 14px; color: #606367; } 
.course-block ul { margin-right: -20px; } 
.course-block li { float: left; width: 33.33%; margin-top: 20px; min-height: 280px; } 
.course-item { margin-right: 20px; background: #fff; box-sizing: border-box; padding: 30px 20px 20px; border-radius: 6px; overflow: hidden; position: relative; transition: .3s; } 
.course-item:hover { box-shadow: 0px 0px 20px 1px rgba(47, 49, 51, .2); transform: translateY(-4px); -webkit-transform: translateY(-4px); } 
.course-label { position: absolute; color: #fff; background: #F5891E; right: 0; top: 0; padding:0px 12px; height: 30px; line-height: 30px; font-size: 14px; border-radius: 0 0 0 20px; } 
.course-item__title { font-size: 20px; font-weight: normal; line-height: 25px; height: 50px; margin-bottom: 12px; overflow: hidden; } 
.course-item__title .play-label { font-size: 14px; line-height: 22px; display: inline-block; height: 22px; padding: 0 7px; color: #3C81F9; border: 1px solid #3C81F9; border-radius:12px 0px 12px 0px; } 
.course-item__info { margin-bottom: 20px; } 
.course-item__info span { color:#8D9299; font-size:14px } 
.teacher-item { float: left; margin-right: 20px; text-align: center; } 
.teacher-item a { display: block; max-width: 60px; } 
.teacher-item img { display: block; width: 40px; height: 40px; border-radius: 40px; margin: 0 auto 8px; } 
.teacher-item p { color:#8D9299; font-size:14px; line-height: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } 
.course-item__teacher { margin-bottom:20px; min-height: 62px; } 
.course-item__bottom { padding-top:20px; border-top: 1px solid #E6E9ED; } 
.course-item__bottom p { font-size: 14px; color: #8D9299; line-height: 24px; } 

.end-time { color: #F5891E; } 
.remaining .num { color:#E91C35; margin: 0 5px; } 
.price-tuan { font-size: 14px; color:#E91C35; font-weight: normal; border: 1px solid #E91C35; height: 20px; line-height: 20px; padding:0px 6px; margin-right: 13px; border-radius: 2px; } 
.market-price { font-size: 16px; text-decoration: line-through; color:#8D9299; margin-right:6px; vertical-align: middle; } 
.price { color:#E91C35; font-size: 24px; white-space: nowrap; overflow: hidden; line-height: 24px; text-overflow: ellipsis; vertical-align: middle; /* max-width: 200px; */ } 
.vipprice { font-size: 14px; display: inline-block; border: 1px solid #e91c35; line-height: 22px; padding: 0 5px; border-radius: 4px; vertical-align: top; } 
.course-block li.first-item { width: 66.67%; } 
.first-item__box { margin-right: 20px; height: 280px; border-radius: 6px; overflow: hidden; position: relative; } 
.first-item__box img { height: 100%; width: 100%; object-fit: cover; } 
.first-item__box h3 { font-weight: normal; line-height: 40px; height: 40px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; background: rgba(0, 0, 0, .4); position: absolute; width: 100%; left: 0; bottom: 0; padding: 0 14px; box-sizing: border-box; font-size: 16px; } 
.first-item__box h3 a { color: #fff; } 
/* .main { padding-bottom: 60px; } */


/*20210125直播样式*/
.recently-live{padding-top:40px;}
.recently-live ul { margin-right:-20px; } 
.recently-live li { float:left; width:33.33%; } 
.recently-live .recently-live-box { margin-right:20px; background:#fff; margin-top:20px; padding: 20px; border-radius:4px; overflow: hidden; height: 145px; box-sizing: border-box; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } 
.live-status { margin-bottom: 14px; } 
.live-status-label { display: inline-block; height: 20px; line-height: 20px; padding: 0 9px; border-radius: 20px; color: #8D9299; background: #F0F2F5; } 
.recently-img-box { width:48px; height:48px; overflow:hidden; border-radius:80px; margin-right: 16px; } 
.recently-img-box img { width:100%; height: 100%; object-fit: cover; } 
.recently-info { width: 275px; margin-top: -5px; } 
.recently-info h2 { font-size: 16px; font-weight:600; line-height: 25px; max-height:50px; overflow: hidden; } 
.recently-info p { margin-top: 7px; } 
.recently-info p a { font-size: 14px; color: #787C82; } 
.live-status-dot { display: inline-block; width: 4px; height: 4px; background: #8D9299; border-radius: 5px; margin-right: 5px; vertical-align: middle; } 
.recently-live-box:hover { box-shadow: 0px 2px 10px 0px rgba(6, 17, 36, 0.15); transition: all 0.3s ease; } 
.living-status { background-image: linear-gradient(to bottom, #FF703E, #FF974F); color: #fff; } 
.living-status .live-status-dot { background: url(common_icon_living.png) no-repeat center; width: 10px; height: 10px; background-size: 10px; border-radius: 0; margin-right: 4px; vertical-align: initial; } 


/*专栏样式*/
.priceInfo { float: right; font-size: 16px; max-width: 50%; height: 16px; line-height: 16px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: #E91C35; } 
.free_cor,.green-font { color:#2BC152 !important; } 
.course-column ul { margin-right: -20px; } 
.course-column li { float: left; width: 50%; margin-top: 20px; } 
.course-column-item { background: #fff; margin-right: 20px; border-radius: 8px; box-sizing: border-box; padding:20px; display: flex; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } 
.course-column-item .course-column-img { width: 176px; height: 99px; border-radius: 8px; overflow: hidden; margin-right: 16px; } 
.course-column-img img { width: 100%; height: 100%; object-fit: cover; } 
.course-column-intro { line-height: 20px; height: 40px; color: #787C82; font-size: 12px; margin-top: 12px; overflow: hidden; } 
.course-column-text { position: relative; flex: 1; } 
.course-column-info { position: absolute; bottom: 0; left:0; width: 100%; font-size: 14px; line-height: 16px; } 
.course-column-price { color:#787C82; } 
.course-column-text h3 { font-size: 16px; line-height: 16px; height: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 5px; font-weight: 600; } 
.course-column-price { font-size:16px; color:#E91C35; } 
.course-column-item:hover { box-shadow: 0px 2px 10px 0px rgba(6, 17, 36, 0.15); transition: all 0.3s ease; } 
.course-column-people { color: #787C82FF; font-size: 14px; } 


/* 20210225 专栏*/
.main .course-block { display: none; } 
.main .course-block:first-child{display: block;}
.course-item__teacher { height: 63px; overflow: hidden; } 
.course-item__teacher a { float: left; margin-right: 20px; text-align: center; min-height: 63px; } 
.course-item__teacher img { display: block; width: 40px; height: 40px; border-radius: 40px; margin:0 auto 8px; } 

/* 新增加的模块 */
.new-add-block { margin-top:40px; } 
.news-list { width: 580px; margin-right: 20px; background: #fff; box-sizing: border-box; padding:20px; border-radius: 6px; overflow: hidden; position: relative; float: left; display: flex; flex-direction: row; justify-content: end; } 
.study-data { width: 580px; position: relative; float: right; } 
.study-data-top,.study-data-bottom { background: #fff; box-sizing: border-box; padding:21px 30px; border-radius: 6px; overflow: hidden; } 
.study-data-bottom { margin-top: 20px; } 
.news-list-left { width: 168px; margin-right: 20px; } 
.news-list-right { margin-right: 0 !important; flex: 1; max-width: 352px; } 
.news-list-left-item { margin-bottom: 20px; } 
.news-list-left-item:last-child { margin-bottom: 0; } 
.news-list-left-item img { width: 100%; height: 150px; object-fit: cover; display: block; } 
.news-list-right li { margin-bottom: 15px; font-size: 14px; padding-left: 20px; position: relative; } 
.news-list-right li:last-child { margin-bottom: 0; } 
.news-list-right li a { display:block; line-height: 25px; height: 25px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } 
.news-list-right-dot { width: 6px; position: absolute; height: 6px; border-radius: 6px; background: #cbced7; left: 5px; top: 50%; margin-top: -3px; } 

.study-data-top_item { margin-bottom: 30px; } 
.study-data-top_item:last-child { margin-bottom: 0; } 
.study-data-top_item a { display: flex; flex-direction: row; justify-content: end; align-items: center; } 
.data-top_item-img { width: 36px; height: 36px; object-fit: cover; margin-right: 20px; } 
.data-top_item-info { width: 40px; margin-right: 20px; text-align: center; } 
.data-top_item-con { flex: 1; line-height: 18px; max-width: 404px; } 
.data-top_item-con h2 { font-size: 12px; font-weight: normal; line-height: 12px; height: 12px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin-bottom: 12px; } 
.data-top_item-con p { color: #888; line-height: 12px; height: 12px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } 
.data-top_item-info_label { background-image: linear-gradient(-90deg, #ff5452, #fe8e8d); color: #fff; font-size: 12px; border-radius: 16px 16px 16px 0; } 
.data-top_item-info_size { margin-top: 8px; color: #888; line-height: 12px; overflow: hidden; height: 12px; white-space: nowrap; text-overflow: ellipsis; } 
.advertisement { margin-top: 20px; } 
.advertisement ul { margin-left:-20px; } 
.advertisement li { float: left; width: 33.33%; } 
.advertisement li a { display: block; margin-left: 20px; height: 114px; border-radius: 6px; overflow: hidden; } 
.advertisement li img { width: 100%; height: 100%; object-fit: cover; } 

.study-data-bottom ul { display: flex; flex-direction: row; justify-content: end; } 
.study-data-bottom_item { flex: 1; text-align: center; border-right: 1px solid #E6E9ED; } 
.study-data-bottom_item:last-child { border-right: 0; } 
.study-data-bottom_item img { width: 44px; height: 44px; margin: 0 auto 25px; display: block; } 
.study-data-bottom_item h2 { font-size: 18px; line-height: 18px; font-weight: normal;} 

/* 底部新加的推荐评价和社群 */
.comment-block { margin-top: 20px;margin-bottom:30px; } 
.comment-block-left { float: left; width: 580px; box-sizing: border-box; padding: 20px 20px 15px; background: #fff; border-radius: 6px; margin-right: 20px; } 
.comment-block-left_item { display: flex; flex-direction: row; justify-content: end; margin-bottom: 10px; } 
.comment-block-left_item:last-child { margin-bottom: 0; } 
.block-left_item-img { display:block; width:60px; height:60px; overflow: hidden; border-radius: 5px; margin-right: 20px; } 
.block-left_item-img img { width: 100%; height: 100%; object-fit: cover; } 
.block-left_item-con { padding: 10px 0; border-bottom:1px solid #E6E9ED; flex: 1; box-sizing: border-box; min-height: 60px; max-width: 460px; } 
.comment-block-left_item:last-child .block-left_item-con { border-bottom: 0; } 
.block-left_item-con h2 { font-size: 14px; line-height: 14px; height: 14px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;    font-weight: normal; } 
.block-left_item-info { margin-top: 10px; flex-direction: row; display: flex; justify-content: end; } 
.block-left_item-label { display: inline-block; background: #eee; padding: 2px 10px; border-radius: 10px; font-size: 12px; color: #777; } 
.block-left_item-time { text-align: right; color: #999; flex: 1; line-height: 20px; } 
.block-left_item-con p { margin-top: 10px; color: #777; } 
.block-left_item-con p span { margin-right:20px; } 
.label-blue { color: #4181ff; background: #eaf2ff; } 
.comment-block-right { float: left; width: 580px; } 
.comment-block-right ul { margin-right: -20px; } 
.comment-block-right_item { float: left; width: 50%; margin-bottom: 20px; } 
.block-right_item { box-sizing: border-box; padding: 38px 20px; background: #fff; border-radius: 6px; margin-right: 20px;     height: 352px;} 
.block-right_item { text-align: center; } 
.block-right_item img { width: 64px; height: 64px; object-fit: cover; border-radius: 64px; margin-bottom: 25px; } 
.block-right_item h2 { font-size: 20px; line-height: 20px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; margin-bottom: 20px;font-weight: normal; } 
.block-right_item p { font-size: 16px; line-height: 22px; color: #777; height: 44px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin-bottom: 20px; } 
.block-right_item-info { font-size: 16px; color: #777; margin-bottom: 20px; line-height: 16px; } 
.block-right_item a { display: inline-block; height: 36px; line-height: 36px; font-size: 15px; width: 122px; border: 2px solid #31b27c; color: #31b27c; border-radius: 5px; }